@extends('layouts.mobile_main')

@section('title', '个人资料')

@section('resources')
    @parent
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <link rel="stylesheet" href="{{ env('CSS_DOMAIN') }}/css/public.css?v={{env('CSS_VERSION')}}">
    <link rel="stylesheet" href="{{ env('CSS_DOMAIN') }}/css/mobiscroll.css?v={{env('CSS_VERSION')}}">
    <script src="{{ env('JS_DOMAIN') }}/js/adaptation.js?v={{env('JS_VERSION')}}"></script>
@endsection

@section('content')
<div class="paysu_outer">
	<header class="pay_sure oh" style="background-color: #fff;">
		<a class="fl" href="javascript:history.go(-1);"><img class="fl" src="{{env('IMAGE_DOMAIN')}}/images/back_p.png?v={{env('IMAGE_VERSION')}}" alt=""></a>
		<span class="fl co_violet fz_48">个人信息</span>
		<span class="fz_34 personal_keep fr co_violet">保存</span>
	</header>
	<section class="information_center">
		<ul>
			<li class="fz_40" id="touxiang">
				<span class="fl">头像</span>
				<img class="fr" style="width: 0.48rem;height: 0.48rem;margin: 1.2rem 0.6rem 0 0.3rem;" src="{{env('IMAGE_DOMAIN')}}images/go_g.png?v={{env('IMAGE_VERSION')}}" alt="">
				<img class="fr" style="width: 2rem;height: 2rem;border-radius: 50%;margin-top: 0.4rem;background: #bfbfbf;" src="{{$avatar}}" id="avatar" alt="">
			</li>
			<li class="fz_40">
				<span class="fl">昵称</span>
				<input maxlength="12" class="fz_40 fr co_gray7f" id="nickname" type="text" value="{{$nickname}}">
			</li>
			<li class="fz_40">
				<span class="fl">性别</span>
				<span class="fr sex_sure co_gray7f">
                    @if($sex == 1)男
                    @elseif($sex == 2)女
                    @else  保密
                    @endif
				</span>
			</li>
			<li class="fz_40">
				<span class="fl">生日</span>
            @if($birthday == '0000-00-00')
                <input value="保密" class="fz_40 fr co_gray7f" readonly name="appDate" id="appDate" type="text">
            @else
				<input value="{{date('Y-m-d', strtotime($birthday))}}" class="fz_40 fr co_gray7f" readonly name="appDate" id="appDate" type="text">
            @endif
			</li>
		</ul>
	</section>
</div>
<div class="popup_mark">
	<div class="sex">
		<p class="fz_50 co_violet">性别</p>
		<p class="oh sex_men"><span class="fz_44 co_violet fl">保密</span><input class="fr baomi" type="radio" name="sex" value="保密"></p>
		<p class="oh sex_men"><span class="fz_44 co_violet fl">男</span><input class="fr men" type="radio" name="sex" value="男"></p>
		<p class="oh" style="padding-top: 0.2rem;"><span class="fz_44 co_violet fl">女</span><input class="fr women" type="radio" name="sex" value="女"></p>
	</div>
</div>
@endsection

@section('scriptResources')
    @parent
    <script src="{{env('JS_DOMAIN')}}/js/mobiscroll.js?v={{env('JS_VERSION')}}"></script>
    <script>
	    window.onresize=function(){
		    pagesp();
	    }
	    $(function(){
	    	$("#touxiang").click(function(){
	    		alert("暂不支持修改");
	    	})
		    var paysu_outer_h=$(window).height();
		    $(".paysu_outer").css({"min-height":paysu_outer_h});
		    $(".popup_mark").height($(window).height());
		    $(".information_center ul li").click(function(){
		    	$(".personal_keep").show();
		    })
		    $(".sex_sure").click(function(){
		    	$(".popup_mark").show();
		    	$(".sex").show();
		    	if($(".sex input").val()==$(".sex_sure").html()){
		    		var i=$(".sex input").index()-1;
		    		$(".sex input").eq(i).attr("checked","checked")
		    	}
		    })
		    $(".baomi").click(function(){
		    	$(".sex_sure").html($(".baomi").val());
		    	$(".popup_mark").hide();
		    	$(".sex").hide();
		    })
		    $(".men").click(function(){
		    	$(".sex_sure").html($(".men").val());
		    	$(".popup_mark").hide();
		    	$(".sex").hide();
		    })
		    $(".women").click(function(){
		    	$(".sex_sure").html($(".women").val());
		    	$(".popup_mark").hide();
		    	$(".sex").hide();
		    })
	    })

	    $(".personal_keep").click(function(){
	    	$(".personal_keep").hide();
	    	var nickname=$("#nickname").val();
	    	var sex=$(".sex_sure").html();
	    	var birthday=$("#appDate").val();
            var avatar = $("#avatar").attr('src');
	    	$.ajax({
	    		url : "/mobile/mycenter/user/save",
	    		type : "post",
	    		dataType:"json",
	    		data:{
	    		    'nickname':nickname,
	    		    'sex':sex,
	    		    'birthday':birthday,
	    		    'avatar':avatar
	    		},
	    		success:function(data){
	    	        if(data.status == 'success') {
	    	            alert("保存成功");
	    	        } else {
	    	            alert(data.message);
	    	        }
	    		} 
	    	})
	    })

	$(function () {//日历
        var currYear = (new Date()).getFullYear();	
        var opt={};
        opt.date = {preset : 'date'};
        opt.datetime = {preset : 'datetime'};
        opt.time = {preset : 'time'};
        opt.default = {
            theme: 'android-ics light', //皮肤样式 
            display: 'modal', //显示方式 
            mode: 'scroller', //日期选择模式
            dateFormat: 'yyyy-mm-dd',
            lang: 'zh',
            showNow: true,
            nowText: "今天",
            startYear: currYear - 100, //开始年份
            endYear: currYear + 100 //结束年份
        };
        $("#appDate").mobiscroll($.extend(opt['date'], opt['default']));
    });
    </script>
@endsection